<template>
  <!-- 手机号登录 loginByTel.vue -->
  <view class="logoBox">
    <image src="https://www.yongshantuan.cn/images/yongshan/logo.png" mode="" class="logo"></image>
    <view class="telBox"><u-input type="text" placeholder="请输入手机号" v-model="tel" :clearable="false"></u-input> </view>
    <view class="codeBox">
      <u-input type="text" placeholder="验证码 " v-model="code" :clearable="false" :passwordIcon="false"></u-input>
      <view class="getCode" :class="{ dis: hasSendCode }" @click="sendCode">
        获取验证码
        <text v-if="hasSendCode">({{ num }})</text>
      </view>
    </view>
    <view class="commenButton" @click="submit">登录</view>
    <u-toast ref="uToast"></u-toast>
  </view>
</template>

<script>
import { telLogin, getMyInfo, setOpenId, getCode } from '@/utils/req/api.js'
import { telReg } from '../../utils/regular.js'
import { isWechat } from '@/utils/commen'
export default {
  data() {
    return {
      hasSendCode: false,
      num: 60,
      timer: '',
      tel: '',
      code: '',

      froms: '', //
    }
  },
  onLoad(options) {
    let { code, froms } = options
    this.froms = froms
    // if (uni.getStorageSync('isFromCompany')) {
    // 	uni.redirectTo({
    // 		url: '/pages/login/loginByCompany'
    // 	})
    // }

    console.log(window.location.href)
    if (window.location.href.split('code').length != 1) {
      console.log('-------------------', window.location.href.split('code')[1].split('&')[0].split('=')[1])
      this.setOpenId(window.location.href.split('code')[1].split('&')[0].split('=')[1])
    } else {
      if (uni.getStorageSync('token')) {
        getMyInfo().then(res => {
          if (isWechat()) {
            console.log('res.data.result', res.data.result)
            if (res.data.result.openId) {
              uni.navigateTo({
                url: '/pages/index/index',
              })
              // uni.navigateTo({
              // 	url: '/pages/test'
              // })
            } else {
              console.log('wx50c118fbe2e4490f')
              window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx50c118fbe2e4490f&response_type=code&scope=snsapi_base&state=abcdefghigklmnopqrstuvwxyz&redirect_uri=https://www.yongshantuan.cn/#wechat_redirect'
            }
          } else {
            uni.navigateTo({
              url: '/pages/index/index',
            })
          }
        })
      }
    }
  },
  onShow() {},
  methods: {
    async setOpenId(code) {
      let res = await setOpenId({
        code,
      })
      console.log('res', res)
      uni.navigateTo({
        url: '/pages/index/index',
      })
      // uni.navigateTo({
      // 	url: '/pages/test'
      // })
    },
    async sendCode() {
      if (!this.tel) {
        this.$showToast.call(this, '请输入手机号', 'warning')
        return
      }
      if (!telReg.test(this.tel)) {
        this.$showToast.call(this, '请输入正确的手机号', 'warning')
        return
      }
      if (!this.hasSendCode) {
        let res = await getCode({
          phone: this.tel,
        })
        console.log('res', res)
        this.hasSendCode = true
        this.timer = setInterval(() => {
          this.num = this.num - 1
          if (this.num == 0) {
            this.hasSendCode = false
            this.num = 60
            clearInterval(this.timer)
          }
        }, 1000)
      }
    },
    async submit() {
      if (!this.tel) {
        this.$showToast.call(this, '请输入手机号', 'warning')
        return
      }
      if (!telReg.test(this.tel)) {
        this.$showToast.call(this, '请输入正确的手机号', 'warning')
        return
      }
      // if (!this.code) {
      // 	this.$showToast.call(this, '请输入验证码', 'warning')
      // 	return;
      // }
      let res = await telLogin({
        phone: this.tel,
        smsCode: this.code,
      })
      if (res.data.success) {
        console.log('res', res)
        uni.removeStorageSync('hasCompanyLogin')
        uni.setStorageSync('token', res.data.result.token)
        let myInfoResult = await getMyInfo()
        console.log('myInfo', myInfoResult)
        uni.setStorageSync('myInfo', myInfoResult.data.result)
        if (isWechat()) {
          if (myInfoResult.data.result.openId) {
            this.$showToast.call(this, '登录成功')

            console.log('this.froms', this.froms)
            if (this.froms == 'company') {
              uni.navigateTo({
                url: '/pages/order?id=' + uni.getStorageSync('companyId'),
              })
            } else {
              uni.navigateTo({
                url: '../index/index',
              })
            }
            // uni.navigateTo({
            // 	url: '../test'
            // })
          } else {
            window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx50c118fbe2e4490f&response_type=code&scope=snsapi_base&state=abcdefghigklmnopqrstuvwxyz&redirect_uri=https://www.yongshantuan.cn/#/pages/my/order/share#wechat_redirect'
          }
        } else {
          this.$showToast.call(this, '登录成功')
          if (this.froms == 'company') {
            // uni.navigateTo({
            // 	url: '/pages/order?id=' + uni.getStorageSync('companyId')
            // });
            uni.navigateTo({
              url: '../index/index',
            })
          } else {
            uni.navigateTo({
              url: '../index/index',
            })
          }
        }
      } else {
        this.$showToast.call(this, res.data.message, 'warning')
      }
    },
  },
  onUnload() {
    clearInterval(this.timer)
  },
}
</script>

<style lang="scss" scoped>
.logoBox {
  @include flexs(center, center);
  flex-direction: column;
  min-height: 100vh;
  padding: 0 40rpx;

  .logo {
    width: 150rpx;
    height: 150rpx;
    margin-bottom: 50rpx;
  }

  .telBox,
  .codeBox {
    width: 100%;
    margin: 20rpx 0;
    background-color: #ececec;
    border-radius: 100rpx;
    padding: 5rpx 0;
  }

  .codeBox {
    position: relative;

    .getCode {
      position: absolute;
      right: 0;
      top: 0;
      font-size: 28rpx;
      line-height: 28rpx;
      min-width: 30%;
      max-width: 50%;
      height: 100%;
      @include flexs(center, center);
      color: #fa690a;
      padding-right: 20rpx;
    }

    .dis {
      color: rgba(0, 0, 0, 0.35);
    }
  }

  .commenButton {
    padding: 20rpx 0;
    background-color: #fa690a;
    margin-top: 40rpx;
  }
}
</style>
<style lang="scss">
.telBox,
.codeBox {
  .u-input {
    border: 1px solid red;
    border-color: rgba(0, 0, 0, 0) !important;
    text-indent: 40rpx;
    color: rgba(0, 0, 0, 0.35);
    line-height: 2;
    font-size: 28rpx !important;
  }

  /deep/ .u-input__input {
    font-size: 28rpx;
  }
}

.codeBox {
  .u-input {
    width: 50%;
  }
}
</style>
